/* eslint-disable no-empty */
<template>
  <page-card :need-back="true"
             title="同步日志">
    <a-form layout="inline">
      <a-row type="flex"
             style="margin-bottom:20px"
             justify="end">
        <a-col>
          <a-form-item label="名称"
                       prop="name">
            <a-input v-model="params.name"
                     placeholder="请输入应用名称、应用编码"
                     allowClear
                     style="width:250px" />
          </a-form-item>
        </a-col>
        <a-col>
          <a-form-item style="float:center"
                       label="状态"
                       prop="resultCode">
            <a-select v-model="params.resultCode"
                      placeholder="请选择"
                      allowClear
                      style="width:100px">
              <a-select-option value="0">成功</a-select-option>
              <a-select-option value="1">失败</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col>
          <a-form-item class="unit-sync-log-formbar-btn">
            <a-button type="primary"
                      @click="search">查询</a-button>
          </a-form-item>
        </a-col>
      </a-row>
    </a-form>

    <a-table :pagination="pagination"
             @change="handleTableChange"
             @expandedRowsChange="expandedRowsChange"
             :expandedRowKeys="expandedRowKeys"
             ref="table"
             :rowKey="record => record.id"
             :data-source="dataSource"
             :columns="columns">
      <template slot="mediaType"
                slot-scope="item,record">
        <span v-if="record.mediaType === '1'">机构</span>
        <span v-else-if="record.mediaType === '2'">用户</span>
      </template>
      <template slot="resultCode"
                slot-scope="item,record">
        <span v-if="record.resultCode === 0">成功</span>
        <span v-else>失败</span>
      </template>
      <template slot="syncType"
                slot-scope="item,record">
        <span v-if="record.syncType === 'add_org'">新增机构</span>
        <span v-if="record.syncType === 'update_org'">修改机构</span>
        <span v-if="record.syncType === 'del_org'">删除机构</span>
        <span v-if="record.syncType === 'move_org'">移动机构</span>
        <span v-if="record.syncType === 'order_org'">机构排序</span>
        <span v-if="record.syncType === 'start_org'">启用机构</span>
        <span v-if="record.syncType === 'stop_org'">停用机构</span>
        <span v-if="record.syncType === 'sync_org'">批量同步机构</span>
        <span v-if="record.syncType === 'add_user'">新增用户</span>
        <span v-if="record.syncType === 'update_user'">修改用户</span>
        <span v-if="record.syncType === 'del_user'">删除用户</span>
        <span v-if="record.syncType === 'add_post'">添加兼职</span>
        <span v-if="record.syncType === 'change_post'">转岗</span>
        <span v-if="record.syncType === 'del_post'">删除兼职</span>
        <span v-if="record.syncType === 'order_post'">人员排序</span>
        <span v-if="record.syncType === 'sync_user'">批量同步人员</span>
      </template>
      <template slot="operation"
                slot-scope="item,record">
        <a v-if="record.resultCode != '0'"
           @click="sync(record)">再次同步</a>
      </template>

      <a-table slot="expandedRowRender"
               slot-scope="itemP"
               :rowKey="record => record.id"
               :columns="childrenColumn"
               :data-source="childrenDataSource"
               @change="childrenHandleTableChange"
               :pagination="childrenPagination">
        <template slot="resultCode"
                  slot-scope="item,record">
          <span v-if="record.resultCode === 0">成功</span>
          <span v-else>失败</span>
        </template>
        <template slot="syncType"
                  slot-scope="item,record">
          <span v-if="record.syncType === 'add_org'">新增机构</span>
          <span v-if="record.syncType === 'update_org'">修改机构</span>
          <span v-if="record.syncType === 'del_org'">删除机构</span>
          <span v-if="record.syncType === 'move_org'">移动机构</span>
          <span v-if="record.syncType === 'order_org'">机构排序</span>
          <span v-if="record.syncType === 'start_org'">启用机构</span>
          <span v-if="record.syncType === 'stop_org'">停用机构</span>
          <span v-if="record.syncType === 'sync_org'">批量同步机构</span>
          <span v-if="record.syncType === 'add_user'">新增用户</span>
          <span v-if="record.syncType === 'update_user'">修改用户</span>
          <span v-if="record.syncType === 'del_user'">删除用户</span>
          <span v-if="record.syncType === 'add_post'">添加兼职</span>
          <span v-if="record.syncType === 'change_post'">转岗</span>
          <span v-if="record.syncType === 'del_post'">删除兼职</span>
          <span v-if="record.syncType === 'order_post'">人员排序</span>
          <span v-if="record.syncType === 'sync_user'">批量同步人员</span>

          <span v-if="record.syncType === '4'">批量同步</span>
        </template>
        <template slot="operation"
                  slot-scope="item,record">
          <a @click="download(itemP, record)">下载json</a>
        </template>
      </a-table>
    </a-table>
    <sync @cancel="cancel"
            :visible="syncVisible"
            :mediaType="mediaType"
            :syncType="syncType"
            :deptId="deptId"
            :mediaId="mediaId"></sync>
  </page-card>
</template>

<script>
import moment from 'moment'
import 'moment/locale/zh-cn'
import { PAGINATION } from '../../constants'
import { syncLogPage, syncLogInfoPage } from '../../api/application'
import Sync from '../sync/Sync'


export default {
  components:{ Sync },
  data () {
    return {
      syncVisible: false,
      mediaType: '',
      syncType: '',
      mediaId: '',
      expandedRowKeys: [],
      syncLogId: null,
      moment,
      pagination: PAGINATION,
      childrenPagination: PAGINATION,
      dataSource: [],
      params: {
        name: '',
        resultCode: undefined,
        time: []
      },
      columns: [
        {
          title: '名称',
          dataIndex: 'mediaName',
          align: 'center',
          width: '300px'
        },
        {
          title: '同步类型',
          dataIndex: 'mediaType',
          align: 'center',
          scopedSlots: { customRender: 'mediaType' },
          width: '90px'
        },
        {
          title: '同步应用',
          dataIndex: 'systemName',
          align: 'center',
          width: '300px'
        },
        {
          title: '同步状态',
          dataIndex: 'resultCode',
          align: 'center',
          width: '90px',
          scopedSlots: { customRender: 'resultCode' }
        },
        {
          title: '操作类型',
          dataIndex: 'syncType',
          align: 'center',
          width: '200px',
          scopedSlots: { customRender: 'syncType' }
        },
        {
          title: '同步结果',
          dataIndex: 'resultMessage',
          align: 'center'
        },
        {
          title: '操作',
          dataIndex: 'operation',
          align: 'center',
          width: '100px',
          scopedSlots: { customRender: 'operation' }
        }
      ],
      childrenDataSource: [],
      childrenColumn: [
        {
          title: '操作类型',
          dataIndex: 'syncType',
          align: 'center',
          scopedSlots: { customRender: 'syncType' },
          width: '150px'
        },
        {
          title: '请求地址',
          dataIndex: 'requestUrl',
          align: 'center',
          width: '400px'
        },
        {
          title: '同步状态',
          dataIndex: 'resultCode',
          align: 'center',
          width: '90px',
          scopedSlots: { customRender: 'resultCode' }
        },
        {
          title: '同步结果',
          dataIndex: 'resultMessage',
          align: 'center',
          width: '290px'
        },
        {
          title: '同步时间',
          dataIndex: 'syncTime',
          align: 'center',
          width: '200px'
        },
        {
          title: '操作人',
          dataIndex: 'createAccount',
          align: 'center',
          width: '100px'
        },
        {
          title: '操作',
          dataIndex: 'operation',
          align: 'center',
          width: '90px',
          scopedSlots: { customRender: 'operation' }
        }
      ]
    }
  },
  activated () {
    this.load()
  },
  methods: {
    handleTableChange (pagination) {
      this.pagination = pagination
      this.pagination.currPage = this.pagination.current
      this.load()
    },
    childrenHandleTableChange (pagination) {
      this.childrenPagination = pagination
      this.childrenLoad()
    },
    search () {
      this.pagination.currPage = 1
      this.load()
    },
    load () {
      this.params.currPage = this.pagination.current
      this.params.pageSize = this.pagination.pageSize
      if (this.params.time.length > 0) {
        this.params.startTime = this.params.time[0]
        this.params.endTime = this.params.time[1]
      } else {
        this.params.startTime = null
        this.params.endTime = null
      }
      syncLogPage(this.params).then(res => {
        this.dataSource = res.list
        this.pagination.current = res.currPage
        this.pagination.total = res.totalCount
      })
    },
    expandedRowsChange (expandedRows) {
      this.childrenPagination.current = 1
      this.childrenPagination.pageSize = 10
      this.childrenDataSource = []
      this.expandedRowKeys = []
      if (expandedRows.length > 0) {
        // 只展开一行
        this.expandedRowKeys.push(expandedRows[expandedRows.length - 1])
        this.syncLogId = expandedRows[expandedRows.length - 1]
        this.childrenLoad()
      } else {
        this.expandedRowKeys = []
      }
    },
    childrenLoad () {
      syncLogInfoPage({
        syncLogId: this.syncLogId,
        currPage: this.childrenPagination.current,
        pageSize: this.childrenPagination.pageSize
      }).then(res => {
        this.childrenDataSource = res.list
        this.childrenPagination.current = res.currPage
        this.childrenPagination.total = res.totalCount
      })
    },
    cancel () {
      this.syncVisible = false
      this.load()
    },
    sync (record) {
      this.syncVisible = true
      this.mediaId = record.mediaId
      this.syncType = record.syncType
      this.mediaType = record.mediaType
    },
    download (itemP, record) {
      const data = record.requestData
      const link = document.createElement('a')
      const blob = new Blob([data], { type: 'application/vnd.ms-excel;charset=GBK' })
      const objectUrl = URL.createObjectURL(blob) // 创建URL
      link.href = objectUrl
      link.download = itemP.mediaName + '-' + itemP.systemName + '-' + record.syncTime + '.txt' // 自定义文件名
      link.click() // 下载文件
      URL.revokeObjectURL(objectUrl) // 释放内存
    }
  }
}
</script>

<style lang="less">
.unit-sync-log-formbar-btn {
  margin-right: 0px !important;
}
</style>
